@charset "utf-8";

article,
aside,
audio,
body,
dd,
div,
dl,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
iframe,
input,
label,
menu,
nav,
ol,
p,
section,
select,
td,
textarea,
th,
time,
ul,
video {
  margin: 0;
  padding: 0;
}

article,
aside,
audio,
canvas,
footer,
header,
hgroup,
nav,
section,
video {
  display: block;
}

body {
  font-size: 14px;
  font-family: 微软雅黑;
  color: #fff;
  padding: 0;
  color: #333;
}

@font-face {
  font-family: abel;
  src: url(/statics/dcbrowser/fonts/abel.0bb6057.ttf);
}

textarea {
  resize: none;
}

iframe,
img {
  border: 0;
}

ol,
ul {
  list-style: none;
}

input,
select,
textarea {
  outline: 0;
  -webkit-user-modify: read-write-plaintext-only;
}

a {
  text-decoration: none;
  color: #333;
}

h1,
h2,
h3,
h4 {
  font-weight: 100;
}

img {
  display: block;
}

em,
i {
  font-style: normal;
}

a {
  color: #fff;
}

a:hover {
  color: #ff5f50;
}

i {
  font-family: iconfont;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body #__layout {
  min-width: 1300px;
}

.back {
  right: 44px;
  bottom: 100px;
  width: 50px;
  height: 50px;
  z-index: 1000;
  cursor: pointer;
  background: url(/statics/dcbrowser/image/top.png) no-repeat 50%
    rgba(0, 0, 0, 0.5);
}

.back,
.top {
  position: fixed;
}

.top {
  height: 90px;
  width: 100%;
  min-width: 1300px;
  top: 0;
  left: 0;
  z-index: 99;
}

.top.feed .topbg {
  opacity: 0;
}

.top .topbg {
  position: relative;
  height: 100%;
  width: 100%;
  opacity: 0.05;
  background: #000;
}

.top .cen_top {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9;
  display: flex;
  justify-content: space-between;
  width: 1200px;
  box-sizing: border-box;
  padding-left: 0;
  height: 90px;
  align-items: center;
}
.top .cen_top .logo a {
  display: block;
  position: relative;
  height: 54px;
  line-height: 54px;
  padding-left: 65px;
  color: #444141;
  font-size: 26px;
  letter-spacing: 2px;
}
.top .cen_top .logo a::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 54px;
  height: 54px;
  background: url(/statics/dcbrowser/image/logo.png) center left / 246px 54px
    no-repeat;
}
.top .cen_top .logo a:hover {
  color: #444141;
}
.top .cen_top .nav_list {
  display: flex;
  flex-wrap: wrap;
  text-align: right;
}

.top .cen_top .nav_list .list {
  color: #3b3838;
  font-size: 16px;
  text-align: center;
  margin-right: 29px;
  position: relative;
  line-height: 40px;
  cursor: pointer;
}

.top .cen_top .nav_list .list.mr0 {
  margin-right: 0;
}

.top .cen_top .nav_list .list.router-link-exact-active:not(.second):after {
  position: absolute;
  content: "";
  height: 4px;
  width: 64px;
  background: #fa4343;
  top: -25px;
  left: 50%;
  margin-left: -32px;
  z-index: 9;
}

.top .cen_top .nav_list .list.router-link-exact-active:not(.second) span {
  color: #fa4343;
}

.top .cen_top .nav_list .list.second {
  height: 40px;
  line-height: 40px;
  padding: 0 26px;
  box-sizing: border-box;
  margin-right: 0;
  white-space: nowrap;
}

.top .cen_top .nav_list .list.second.text-left {
  text-align: left;
}

.top .cen_top .nav_list .list.router-link-exact-active.second,
.top .cen_top .nav_list .list:hover.second,
.top .cen_top .nav_list .list:hover span {
  color: #fa4343;
}

.top .cen_top .nav_list .list.fuceng .fuceng-main {
  position: absolute;
  top: 40px;
  border-radius: 4px;
  display: none;
  left: 50%;
  transform: translateX(-50%);
  min-width: 140px;
  font-size: 14px;
  color: #333;
  background: #ececec;
  overflow: hidden;
  z-index: 7;
}

.top .cen_top .nav_list .list.fuceng:hover .fuceng-main {
  display: block;
}

.top .cen_top .nav_list .dow_btn {
  display: block;
  width: 120px;
  height: 40px;
  line-height: 40px;
  background: #3a7df7;
  font-size: 16px;
  color: #fff;
  cursor: pointer;
  text-align: center;
  border-radius: 20px;
  margin-left: 29px;
  -webkit-animation-bairation: 0.3s;
  -webkit-animation-duration: 0.3;
  animation-duration: 0.3;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  webkit-animation-play-state: both;
}

.top .cen_top .nav_list .animate__bounceOutRight {
  display: none;
}

@-webkit-keyframes myfirst {
  0% {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes myfirst {
  0% {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@-webkit-keyframes myfirst2 {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes myfirst2 {
  0% {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.top.topbgs {
  background: #fff;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.10196);
}

.top.topbgs .topbg {
  display: none;
}

.banner {
  display: flex;
  justify-content: center;
  width: 100%;
  min-width: 1300px;
  padding-top: 90px;
  height: 659px;
  background: url(/statics/dcbrowser/image/topbg.png) no-repeat;
  background-size: 100% 100%;
  align-items: center;
}

.banner .leftimg {
  margin-right: 60px;
}

.banner .leftimg img {
  width: 756px;
}

.banner .cen {
  margin-right: 80px;
}

.banner .cen .fontimg {
  width: 466px;
}

.banner .cen .btns {
  margin: 45px auto 30px;
}

.banner .cen .btn,
.banner .cen .btns {
  display: flex;
  align-items: center;
  justify-content: center;
}

.banner .cen .btn {
  width: 170px;
  height: 52px;
  line-height: 52px;
  background: #3b7ef7;
  border-radius: 37px 37px 37px 37px;
  text-align: center;
  font-size: 18px;
  cursor: pointer;
  color: #fff;
}

.banner .cen .btn ~ .btn {
  margin-left: 14px;
}

.banner .cen .btn:not(.black):hover {
  background: #256cec;
}

.banner .cen .btn.black {
  background: #373737;
}

.banner .cen .btn.black:hover {
  background: #515151;
}

.banner .cen .btn img {
  width: 20px;
  vertical-align: middle;
  margin-right: 10px;
}

.banner .cen .btn img,
.banner .cen .btn span {
  cursor: pointer;
  display: inline-block;
}

.banner .cen .btn2 {
  margin-left: 20px;
  width: 30px;
  height: 30px;
  background: #17bb5e;
  border-radius: 5px 5px 5px 5px;
  padding: 10px;
  position: relative;
  z-index: 2;
}

.banner .cen .btn2:hover {
  background: #16a252;
}

.banner .cen .btn2:hover .down-pop {
  display: block;
}

.banner .cen .btn2 img {
  width: 100%;
}

.banner .cen .btn2 .down-pop {
  display: none;
  position: absolute;
  top: 29px;
  left: 32px;
  padding: 18px 20px;
  width: 158px;
  height: 202px;
  background: #fff;
  box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.16);
  border-radius: 6px 6px 6px 6px;
  border: 1px solid #eaeaea;
  font-size: 14px;
  font-family: Microsoft YaHei-Regular, Microsoft YaHei;
  font-weight: 400;
  color: #333;
  line-height: 20px;
  text-align: center;
}

.banner .cen .btn2 .down-pop p {
  margin-top: 5px;
}

.banner .cen .toppx {
  position: fixed;
  -webkit-animation: myf 0.5s forwards;
  animation: myf 0.5s forwards;
  z-index: 999;
}

.banner .cen .bottompx {
  position: relative;
  -webkit-animation: myf2 1s forwards;
  animation: myf2 1s forwards;
}

@-webkit-keyframes myf {
  0% {
    opacity: 1;
    top: 70px;
    width: 300px;
    height: 60px;
    line-height: 60px;
    right: 100px;
  }

  to {
    top: 20px;
    width: 120;
    height: 40px;
    line-height: 40px;
    opacity: 0;
    right: 80px;
  }
}

@keyframes myf {
  0% {
    opacity: 1;
    top: 70px;
    width: 300px;
    height: 60px;
    line-height: 60px;
    right: 100px;
  }

  to {
    top: 20px;
    width: 120;
    height: 40px;
    line-height: 40px;
    opacity: 0;
    right: 80px;
  }
}

@-webkit-keyframes myf2 {
  0% {
    top: 90px;
    right: 100px;
  }
}

@keyframes myf2 {
  0% {
    top: 90px;
    right: 100px;
  }
}

.banner .cen .date {
  color: #3a7df7;
  text-align: center;
  font-size: 14px;
  line-height: 32px;
}

.banner .cen .date .numss {
  margin: 0 10px;
  display: inline-block;
  vertical-align: middle;
}

.banner .cen .date .numss span {
  font-family: abel;
  width: 30px;
  display: inline-block;
  line-height: 32px;
  height: 30px;
  margin-right: 10px;
  font-size: 26px;
  text-align: center;
  background: #c1f5e1;
  border-radius: 2px;
}

.banner .cen .date .numss span:last-child {
  margin-right: 0;
}

.banner .cen .wins {
  font-size: 12px;
  text-align: center;
  color: #999;
  margin-top: 22px;
}

.banner .cen .wins .bgline {
  margin: 0 15px;
}

.swipers {
  min-height: 860px;
}

.swipers .toplist {
  width: 979px;
  display: flex;
  justify-content: space-between;
  margin: 50px auto;
}

.swipers .toplist .list {
  width: 85px;
  text-align: center;
  color: #999;
  font-size: 14px;
  cursor: pointer;
}

.swipers .toplist .list .imgs {
  width: 60px;
  height: 60px;
  margin: 0 auto 10px;
}

.swipers .toplist .list.list1 .imgs {
  background: url(/statics/dcbrowser/image/type0.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list1:hover {
  color: #3a7df7;
}

.swipers .toplist .list.list1:hover .imgs {
  background: url(/statics/dcbrowser/image/typee0.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list1.active {
  color: #3a7df7;
}

.swipers .toplist .list.list1.active .imgs {
  background: url(/statics/dcbrowser/image/typee0.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list2 .imgs {
  background: url(/statics/dcbrowser/image/type1.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list2:hover {
  color: #3a7df7;
}

.swipers .toplist .list.list2:hover .imgs {
  background: url(/statics/dcbrowser/image/typee1.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list2.active {
  color: #3a7df7;
}

.swipers .toplist .list.list2.active .imgs {
  background: url(/statics/dcbrowser/image/typee1.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list3 .imgs {
  background: url(/statics/dcbrowser/image/type2.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list3:hover {
  color: #3a7df7;
}

.swipers .toplist .list.list3:hover .imgs {
  background: url(/statics/dcbrowser/image/typee2.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list3.active {
  color: #3a7df7;
}

.swipers .toplist .list.list3.active .imgs {
  background: url(/statics/dcbrowser/image/typee2.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list4 .imgs {
  background: url(/statics/dcbrowser/image/type3.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list4:hover {
  color: #3a7df7;
}

.swipers .toplist .list.list4:hover .imgs {
  background: url(/statics/dcbrowser/image/typee3.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list4.active {
  color: #3a7df7;
}

.swipers .toplist .list.list4.active .imgs {
  background: url(/statics/dcbrowser/image/typee3.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list5 .imgs {
  background: url(/statics/dcbrowser/image/type4.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list5:hover {
  color: #3a7df7;
}

.swipers .toplist .list.list5:hover .imgs {
  background: url(/statics/dcbrowser/image/typee4.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list5.active {
  color: #3a7df7;
}

.swipers .toplist .list.list5.active .imgs {
  background: url(/statics/dcbrowser/image/typee4.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list-cut .imgs {
  background: url(/statics/dcbrowser/image/type-cut.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list-cut:hover {
  color: #3a7df7;
}

.swipers .toplist .list.list-ai .imgs {
  background: url(/statics/dcbrowser/image/type-ai.png) no-repeat;
  background-size: 100%;
}
.swipers .toplist .list.list-ai:hover .imgs {
  background: url(/statics/dcbrowser/image/typee-ai.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list-ai.active {
  color: #3a7df7;
}

.swipers .toplist .list.list-ai.active .imgs {
  background: url(/statics/dcbrowser/image/typee-ai.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list-cut .imgs {
  background: url(/statics/dcbrowser/image/type-cut.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list-cut:hover {
  color: #3a7df7;
}

.swipers .toplist .list.list-cut:hover .imgs {
  background: url(/statics/dcbrowser/image/typee-cut.png) no-repeat;
  background-size: 100%;
}

.swipers .toplist .list.list-cut.active {
  color: #3a7df7;
}

.swipers .toplist .list.list-cut.active .imgs {
  background: url(/statics/dcbrowser/image/typee-cut.png) no-repeat;
  background-size: 100%;
}

.swipers .cen {
  height: 674px;
  width: 100%;
  background: #fff;
}

.feature {
  background: #f6f6f6;
  height: 860px;
  overflow: hidden;
}

.feature .title {
  text-align: center;
  margin-bottom: 62px;
}

.feature .title h2 {
  font-size: 50px;
  font-weight: 700;
  margin: 62px 0 16px;
}

.feature .title p {
  font-size: 14px;
  color: #333;
  letter-spacing: 6px;
}

.feature .cen {
  width: 1126px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.feature .cen.clo5 {
  width: 1036px;
}

.feature .cen.clo5 .list,
.feature .cen.clo5 .list:nth-child(6n) {
  margin-right: 40px;
}

.feature .cen.clo5 .list:nth-child(5n) {
  margin-right: 0;
}

.feature .cen .list {
  width: 175px;
  height: 234px;
  border-radius: 10px;
  background: #fff;
  position: relative;
  margin-right: 15px;
  margin-bottom: 40px;
}

.feature .cen .list:nth-child(6n) {
  margin-right: 0;
}

.feature .cen .list .dom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  text-align: center;
}

.feature .cen .list .dom .imgblock {
  display: block;
  width: 65px;
  margin: 39px auto 18px;
}

.feature .cen .list .dom .titles {
  font-size: 14px;
  font-weight: 400;
  color: #000;
  line-height: 16px;
  margin-bottom: 10px;
}

.feature .cen .list .dom .text {
  font-size: 10px;
  color: #666;
  width: 140px;
  margin: 0 auto;
  text-align: center;
  line-height: 16px;
}

.feature .cen .list:hover {
  transform: scale(1.05);
}

.user_evaluate {
  height: 540px;
  overflow: hidden;
}

.user_evaluate .title {
  text-align: center;
  margin: 0 auto 62px;
  background: url(/statics/dcbrowser/image/userbg.png) no-repeat;
  background-size: 100% 100%;
  width: 1320px;
}

.user_evaluate .title h2 {
  font-size: 50px;
  font-weight: 700;
  margin: 62px 0 10px;
}

.user_evaluate .title p {
  font-size: 14px;
  color: #999;
}

.user_evaluate .cen .swiperst {
  width: 1198px;
  height: 220px;
  margin: 0 auto;
}

.user_evaluate .cen .swiperst .swi_slide {
  display: flex;
}

.user_evaluate .cen .swiperst .swi_slide .list {
  padding: 58px 25px 15px;
  box-sizing: border-box;
  background: #f6f6f6;
  display: inline-block;
  width: 390px;
  height: 100%;
  position: relative;
  margin-right: 12px;
}

.user_evaluate .cen .swiperst .swi_slide .list:nth-child(3) {
  margin-right: 0;
}

.user_evaluate .cen .swiperst .swi_slide .douhao {
  width: 35px;
  position: absolute;
  top: 15px;
  left: 15px;
  z-index: 7;
}

.user_evaluate .cen .swiperst .swi_slide .cont {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: absolute;
  left: 0;
  right: 0;
  box-sizing: border-box;
  bottom: 22px;
  padding: 0 25px;
}

.user_evaluate .cen .swiperst .swi_slide .cont .left .img {
  width: 30px;
  display: inline-block;
  overflow: hidden;
  height: 30px;
  border-radius: 30px;
  vertical-align: middle;
}

.user_evaluate .cen .swiperst .swi_slide .cont .left .img img {
  width: 100%;
  height: 100%;
}

.user_evaluate .cen .swiperst .swi_slide .cont .left .user {
  font-size: 14px;
  font-weight: 700;
  color: #333;
  margin: 0 15px 0 10px;
}

.user_evaluate .cen .swiperst .swi_slide .cont .left .time,
.user_evaluate .cen .swiperst .swi_slide .cont .right {
  font-size: 12px;
  color: #999;
}

.user_evaluate .cen .nextpero_ben {
  display: flex;
  justify-content: center;
  margin-top: 61px;
}

.user_evaluate .cen .nextpero_ben .pe {
  height: 4px;
  width: 90px;
  cursor: pointer;
  background: #ededed;
  display: block;
}

.user_evaluate .cen .nextpero_ben .pe.activelist {
  background: #4b79d5;
}

.about .contions {
  width: 100%;
  height: 1460px;
  background: url(/statics/dcbrowser/image/about.png) no-repeat;
  background-size: 100% 100%;
  overflow: hidden;
}

.about .contions .title img {
  width: 227px;
  margin: 74px auto;
}

.about .contions .cen {
  padding: 82px 139px 89px;
  box-sizing: border-box;
  width: 1200px;
  height: 1095px;
  margin: 0 auto;
  background: hsla(0, 0%, 100%, 0.904);
  border-radius: 30px;
}

.about .contions .cen .mapimg {
  width: 922px;
  margin: 36px auto 60px;
}

.about .contions .cen .mapimg img {
  width: 100%;
}

.about .contions .cen .ptext {
  font-size: 16px;
  color: #333;
  line-height: 36px;
  text-indent: 25px;
}

.about .contions .cen .fontimg {
  width: 120px;
}

.about .contions .cen .fontimg.fi1 {
  margin-bottom: 60px;
}

.about .contions .cen .fontimg.fi2 {
  margin-bottom: 18px;
}

.about .contions .cen .maptext p {
  font-size: 16px;
  color: #333;
  line-height: 30px;
}

.mtop {
  margin-top: 90px;
}

.faq .tops {
  width: 100%;
  height: 260px;
  display: flex;
  position: relative;
  background: url(/statics/dcbrowser/image/hiop.png) no-repeat;
  background-size: 100% 100%;
}

.faq .tops .title {
  width: 227px;
  margin: 63px auto 0;
}

.faq .tops .title img {
  width: 100%;
}

.faq .tops .tops_cen {
  width: 1200px;
  height: 60px;
  background: #fff;
  border-radius: 10px 10px 0 0;
  position: absolute;
  left: 50%;
  margin-left: -600px;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-around;
  z-index: 7;
  font-size: 16px;
}

.faq .tops .tops_cen .clist {
  cursor: pointer;
  position: relative;
  color: inherit;
  display: block;
}

.faq .tops .tops_cen .clist:nth-child(3) {
  margin-right: 0;
}

.faq .tops .tops_cen .clist.router-link-exact-active {
  color: #3a7df7;
  font-weight: 700;
}

.faq .tops .tops_cen .clist.router-link-exact-active:after {
  content: "";
  position: absolute;
  left: 5px;
  right: 5px;
  bottom: -8px;
  height: 2px;
  background: #3a7df7;
}

.faq .tops .tops_cen .clist:hover {
  color: #3a7df7;
}

.faq .cen {
  width: 100%;
  background: #f7f7f7;
  padding-bottom: 100px;
}

.faq .cen .cen_cont {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  min-height: 601px;
  background: #fff;
}

.faq .cen .cen_cont:not(.nobb) {
  border-top: 1px solid #eeecef;
}

.faq .cen .cen_cont .left_text {
  flex: 0 0 386px;
  box-sizing: border-box;
  padding: 21px 28px 21px 37px;
  height: calc(100% - 100px);
}

.faq .cen .cen_cont .left_text .title {
  font-weight: 700;
  margin-bottom: 15px;
  position: relative;
  padding-left: 10px;
}

.faq .cen .cen_cont .left_text .title:after {
  content: "";
  position: absolute;
  top: 2px;
  bottom: 2px;
  left: 0;
  width: 3px;
  background: #797979;
}

.faq .cen .cen_cont .left_text .list {
  color: #919191;
  font-size: 14px;
  display: block;
  padding: 6px 10px;
  box-sizing: border-box;
  border-radius: 4px;
  margin-bottom: 5px;
  cursor: pointer;
}

.faq .cen .cen_cont .left_text .list:hover {
  color: #3a7df7;
}

.faq .cen .cen_cont .left_text .list.active {
  font-weight: 600;
  color: #3a7df7;
}

.faq .cen .cen_cont .left_text .list .icon {
  width: 8px;
  vertical-align: -0.1em;
  margin-right: 5px;
}

.faq .cen .cen_cont .left_text .list.up .icon {
  transform: rotate(180deg);
}

.faq .cen .cen_cont .left_text .list.up + .list-child {
  display: none;
}

.faq .cen .cen_cont .left_text .list-child {
  padding-left: 2em;
}

.faq .cen .cen_cont .left_text .title ~ .list-child {
  padding-left: 0;
}

.faq .cen .cen_cont .right_text {
  flex: 1;
  border-left: 1px solid #eeecef;
  overflow: hidden;
  box-sizing: border-box;
  padding: 39px 44px;
}

.faq .cen .cen_cont .right_text .about {
  margin: 0 auto;
  width: 1100px;
  font-size: 18px;
  line-height: 30px;
}

.faq .cen .cen_cont .right_text .about p {
  margin-bottom: 30px;
}

.faq .cen .cen_cont .right_text .about h3 {
  text-align: left;
}

.faq .cen .cen_cont .right_text .about img {
  margin: 0 auto;
}

.faq .cen .cen_cont .right_text-tips {
  color: #f59a23;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px dashed #333;
}

.faq .cen .cen_cont2 .left_text {
  flex: 0 0 218px;
  padding: 0;
}

.faq .cen .cen_cont2 .left_text .list {
  border-radius: 0;
  padding: 16px 44px 17px;
  font-size: 16px;
  margin-bottom: 0;
}

.faq .cen .cen_cont2 .left_text .list.active {
  background: #ebebeb;
  color: #3a7df7;
  position: relative;
}

.faq .cen .cen_cont2 .left_text .list.active:after {
  content: "";
  position: absolute;
  height: 18px;
  border-left: 3px solid #3a7df7;
  left: 33px;
  top: 50%;
  margin-top: -9px;
}

.faq .search {
  position: relative;
  height: 40px;
  line-height: 38px;
  margin-bottom: 20px;
}

.faq .search-input {
  position: relative;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: 0 30px 0 10px;
  border: 1px solid #ddd;
  outline: 0;
  border-radius: 5px;
}

.faq .search-input:focus {
  border-color: #3a7df7;
}

.faq .search-icon {
  position: absolute;
  top: 50%;
  right: 6px;
  margin-top: -9px;
  font-size: 18px;
  color: #767474;
  cursor: pointer;
}

.faq .search-icon:hover {
  color: #3a7df7;
}

.faq .nodata {
  text-align: center;
}

.faq .detail,
.faq .nodata {
  font-size: 15px;
}

.faq .detail-title {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 40px;
}

.faq .detail p {
  margin: 15px auto;
  text-indent: 2em;
  text-align: justify;
}

.faq .detail img {
  margin: 30px auto;
  max-width: 680px;
  display: block;
}

.faq .detail strong {
  color: #333;
}

@media (max-width: 1720px) {
  .banner .cen .btn2 .down-pop {
    left: -180px;
  }
}

.hot-img {
  position: absolute;
  top: -4px;
  right: 0;
}

.xz-link {
  color: #3b3838;
}

.xz-link:hover {
  color: #ff5f50;
}

.footer-box {
  background: #383b48;
}

.footer-box .copyRight,
.footer-box .footer-info,
.footer-box .footer-logo-box {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.footer-box .footer-logo-box {
  padding: 20px;
}

.footer-box .footer-info {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  color: #bbb;
}

.footer-box .footer-logo-line {
  height: 1px;
  background-color: #777a89;
}

.footer-box .footer-logo-img {
  position: relative;
  height: 40px;
  line-height: 40px;
  padding-left: 50px;
  color: #fff;
  font-size: 24px;
  letter-spacing: 2px;
}
.footer-box .footer-logo-img::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 40px;
  height: 40px;
  background: url(/statics/dcbrowser/image/logo2.png) center left / 246px 40px
    no-repeat;
}

.footer-box .footer-info {
  padding-top: 20px;
}

.footer-box .copyRight {
  padding: 13px 20px;
  color: #fff;
  text-align: center;
  opacity: 0.6;
}

.footer-box .footer-info-title {
  margin-bottom: 20px;
  line-height: 22px;
  font-size: 22px;
  font-weight: 700;
  color: #fff;
}

.footer-box .footer-link {
  margin-right: 50px;
  line-height: 16px;
  font-size: 16px;
  color: #fff;
}

.footer-box .footer-link:hover {
  color: #ff5f50;
}

.footer-box .kefu-box {
  display: flex;
}

.footer-box .kefu-item {
  display: block;
}

.footer-box .kefu-box .kefu-item + .kefu-item {
  margin-left: 24px;
}

.footer-box .kefu-box img {
  width: 26px;
  height: 26px;
  margin: 0 auto 5px;
}

.kefubox {
  position: fixed;
  right: 30px;
  bottom: 200px;
  width: 80px;
  box-shadow: 0 0 6px #ccc;
  border-radius: 6px;
  z-index: 1000;
  top: 230px;
  height: 300px;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.03922);
}

.kefubox > div {
  height: 75px;
  width: 100%;
  background: hsla(0, 0%, 100%, 0.8);
  text-align: center;
  cursor: default;
  position: relative;
  box-sizing: border-box;
  padding: 1px;
}

.kefubox > div:hover {
  background: #f0f0f0;
}

.kefubox > div:first-child {
  border-radius: 6px 6px 0 0;
}

.kefubox > div:first-child ~ div {
  border-top: 1px solid rgba(232, 232, 232, 0.36863);
}

.kefubox > div:last-child {
  border-radius: 0 0 6px 6px;
}

.kefuimg {
  margin: 10px auto -5px;
}

.kefu .layer.sins {
  padding: 10px 0;
}

.kefu .layer.sins a,
.kefu .layer.sins div {
  padding-left: 23px;
  text-align: left;
}

.kefu .layer.sins a {
  display: block;
  padding-top: 10px;
  padding-bottom: 10px;
  cursor: pointer;
}

.kefu .layer.sins a em {
  text-decoration: underline;
}

.kefu .layer.sins a:hover,
.kefu .layer.sins a:hover em {
  color: #ff5f50;
}

.kefu .layer.sins div {
  padding-bottom: 5px;
}

.kefu .layer.sins div img {
  display: inline-block;
  width: 126px;
  height: 126px;
  vertical-align: text-top;
}

.kefu .layer.sins p {
  border-top: 1px solid #efefef;
  padding-top: 10px;
  margin-top: 5px;
}

.layerbox {
  display: none;
}

.kefu:hover .layerbox {
  width: 250px;
  text-align: center;
  position: absolute;
  left: -240px;
  top: 0;
  display: block;
}

.layer {
  background: #fff;
  box-shadow: 0 0 6px #ccc;
  border-radius: 4px;
  margin-right: 20px;
}

.layer img {
  width: 100%;
}

.layer a {
  display: block;
  color: #333;
}

.layer a em {
  color: #20ca8d;
}

.corner {
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid #fff;
  display: inline-block;
  position: absolute;
  right: 13px;
  top: 20px;
}

.layer p {
  line-height: 25px;
}

.qq:hover .layerbox {
  width: 200px;
  text-align: center;
  position: absolute;
  left: -190px;
  top: 0;
  display: block;
}

.qq .layer a {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}

.qq .layer p {
  line-height: 40px;
  margin-top: -10px;
}

.svg-icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}

.add.image1 {
  border: 1px dashed #e3e3e3;
}

.inputImage {
  display: inline-flex;
  background: red;
  float: left;
  clear: both;
  position: absolute;
  top: 0;
  left: 0;
  height: 90px;
  width: 90px;
  opacity: 0;
}

.addImage {
  display: inline;
}

.add {
  position: relative;
  display: inline-block;
  overflow: hidden;
}

.fbtbox {
  width: 1000px;
  margin: 0 auto;
  position: relative;
}

.fbtbox:after {
  content: "";
  width: 544px;
  height: 347px;
  position: absolute;
  top: -78px;
  left: -95px;
  background: url(/statics/dcbrowser/image/feedbgtop.png) no-repeat;
  background-size: 100% 100%;
  z-index: 1;
}

.fbody {
  flex: 1;
}

.fbtta {
  font-size: 38px;
  color: #333;
  margin: 158px 0 0 450px;
}

.fbttb {
  font-size: 28px;
  color: #5f9cff;
  margin: 5px auto 5px 450px;
  font-weight: 700;
}

.fbtqq,
.fbttc,
.fbtwj {
  float: left;
  height: 42px;
  width: 130px;
  line-height: 42px;
  text-align: center;
  border-radius: 3px;
  color: #fff;
  margin: 10px;
  cursor: pointer;
  background: #5f9cff;
}

.fbtqq {
  margin-left: 450px;
  background: #5f9cff;
  text-align: left;
}

.fbtqq i,
.fbtwj i {
  float: left;
  margin: 12px 10px 0 18px;
}

.fbtwj {
  background: #53b756;
  text-align: left;
  width: 177px;
}

.fbtqq:hover,
.fbttc:hover,
.fbtwj:hover {
  box-shadow: 0 3px 10px #b2ddff;
}

.fbtqq a,
.fbtwj a {
  color: #fff;
  float: left;
  width: 100%;
  height: 42px;
}

.fbttc {
  background: none;
  border: 1px solid #666;
  border-radius: 4px;
}

.fbttc,
.fbttc a {
  color: #666;
}

.fbtop {
  background: url(/statics/dcbrowser/image/topbg.png) no-repeat;
  background-size: 100% 100%;
  height: 448px;
  width: 100%;
  display: inline-block;
}

.fblayer {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 10000;
}

.fblayerbox {
  border-radius: 10px;
  width: 711px;
  margin: -324px 0 0 -365px;
  height: 648px;
  position: absolute;
  left: 50%;
  top: 50%;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
}

.fbtt {
  height: 125px;
  width: 711px;
  background: url(/statics/dcbrowser/image/feedbg3.jpg) no-repeat 0 0;
  line-height: 90px;
  font-size: 20px;
  color: #333;
  text-align: center;
  font-weight: 700;
}

.fbtxt {
  margin: 0 auto;
  width: 85%;
}

.fbtxt p {
  margin-bottom: 20px;
  line-height: 25px;
  color: #666;
}

.fbtxt h4 {
  font-size: 16px;
  font-weight: 700;
  line-height: 30px;
}

.close {
  margin: 10px auto;
  width: 136px;
  height: 38px;
  border: 1px solid #39a8ff;
  line-height: 38px;
  text-align: center;
  color: #39a8ff;
  border-radius: 3px;
  cursor: pointer;
}

.close:hover {
  box-shadow: 0 3px 10px #b2ddff;
}

.feedback {
  margin: 50px auto;
  width: 1000px;
}

.feedback li {
  margin: 5px auto 20px;
  clear: both;
}

.feedback li .tt {
  font-weight: 700;
  color: #333;
  font-size: 15px;
}

#fdsl-upbtn {
  display: none;
  width: 440px;
  vertical-align: middle;
}

#fdsl-upbtn > div {
  float: left;
}

#fdsl-upbtn .upbtn {
  display: block;
  width: 58px;
  height: 33px;
  line-height: 33px;
  color: #000;
  margin: 0 10px;
  text-align: center;
  background-color: #efefef;
  border-radius: 4px;
  border: 1px solid #767676;
}

#fdsl-upbtn span {
  color: red;
  line-height: 35px;
}

#fdsl,
.txt,
.txtbig {
  height: 35px;
  width: 460px;
  border: 1px solid #e3e3e3;
  border-radius: 3px;
  margin: 10px auto;
  display: inline-block;
  line-height: 35px;
  font-size: 16px;
  padding: 0 10px;
}

#fdsl.warning,
.txt.warning,
.txtbig.warning {
  border-color: #f87373;
}

.txtbig {
  width: 100%;
  box-sizing: border-box;
  height: 160px;
  font-size: 14px;
  color: #000;
  line-height: 20px;
  padding: 12px 20px;
}

.txtbig::-moz-placeholder {
  font-size: 12px;
}

.txtbig:-ms-input-placeholder {
  font-size: 12px;
}

.txtbig::placeholder {
  font-size: 12px;
}

.txtbig-wrap {
  position: relative;
  width: 800px;
}

.txtbig-limit {
  position: absolute;
  bottom: 18px;
  right: 5px;
  font-size: 12px;
  color: #999;
  background: #fff;
  height: 15px;
}

.txt::-moz-placeholder {
  font-size: 12px !important;
}

.txt:-ms-input-placeholder {
  font-size: 12px !important;
}

.txt::placeholder {
  font-size: 12px !important;
}

#fdsl {
  display: inline-block;
  vertical-align: middle;
  height: auto;
}

#fdsl,
#fdsl i {
  position: relative;
}

#fdsl i {
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #333;
  top: 12px;
  right: -22px;
}

#fdsl .tips {
  position: absolute;
  right: 0;
  top: 0;
  width: 50px;
  height: 33px;
  cursor: pointer;
}

#fdsl input {
  display: block;
  height: 35px;
  width: 410px;
  padding-left: 8px;
  font-size: 16px;
  border: 0;
}

.fdslbox {
  width: 480px;
  border: 1px solid #e3e3e3;
  position: absolute;
  top: 36px;
  left: -1px;
  background: #fff;
  z-index: 999;
  max-height: 500px;
  overflow: auto;
  z-index: 98;
}

.fdslbox dd {
  height: 35px;
  line-height: 35px;
  border-bottom: 1px dotted #e8e8e8;
  padding: 0 8px;
}

.fdslbox dd:hover {
  background: #f3f3f3;
  color: #39a8ff;
}

.fdslbox dd:last-child {
  border: none;
}

.feedback .add {
  border: 1px dashed #39a8ff;
  width: 30px;
  height: 30px;
  padding: 30px;
  text-align: center;
  vertical-align: middle;
  display: inline-block;
  margin: 20px 0;
  border-radius: 6px;
}

.upimg {
  display: inline-block;
  width: 90px;
  height: 90px;
  float: left;
  border: 1px solid #e3e3e3;
  margin: 20px 20px 20px 0;
  border-radius: 6px;
  position: relative;
}

.upimg i {
  position: absolute;
  top: -5px;
  right: -5px;
  height: 17px;
  width: 17px;
  background: url(/statics/dcbrowser/image/btn1.png) no-repeat;
}

.upimg img {
  width: 100%;
  height: 100%;
  border-radius: 6px;
}

.upimg span {
  width: 100%;
  height: 100%;
  background-color: hsla(0, 0%, 56.5%, 0.6);
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
}

.upimg span em {
  background-color: #fff;
  color: #ec0000;
  font-size: xx-small;
  text-align: center;
  margin-top: 60px;
  border: 1px solid #f87373;
}

.btn {
  cursor: pointer;
  color: #fff;
  box-shadow: 0 3px 10px #8ecdff;
  border-radius: 4px;
  background: #26a1ff;
  height: 40px;
  width: 150px;
  border: none;
  font-size: 16px;
}

.btn:hover {
  box-shadow: 0 3px 10px #26a1ff;
}

.error {
  border: 1px solid #f87373;
}

.warn {
  color: #f87373;
  margin: 0 20px;
}

.finsh_cen {
  overflow: hidden;
  flex: 1;
  position: relative;
}

.finsh_cen:after,
.finsh_cen:before {
  content: "";
  position: absolute;
  background-image: url(/image/feedbg6.png);
  background-repeat: no-repeat;
}

.finsh_cen:after {
  left: 0;
  bottom: -4px;
  width: 50%;
  height: 50%;
  background-position: 0 100%;
}

.finsh_cen:before {
  right: 0;
  top: 0;
  width: 50%;
  height: 50%;
  background-position: 100% 0;
}

.finish {
  text-align: center;
  padding-bottom: 250px;
  position: relative;
  z-index: 1;
}

.code {
  margin: 50px auto 20px;
  padding: 20px;
  background: #fff;
  box-shadow: 0 0 15px #beeeff;
  display: inline-block;
}

.finish p {
  color: #aaa;
  margin-top: 10px;
}

.finish p strong {
  color: #333;
  font-size: 20px;
}

.fimg {
  margin: 50px auto 0;
  display: inline-block;
}

#fdsl:hover,
.txt:focus,
.txtbig:focus {
  border: 1px solid #39a8ff;
}

.tt i {
  color: #ec0000;
  margin-right: 2px;
}

.code p i {
  color: #20ca8d;
}

.code p:hover,
.code p:hover i {
  color: #ff5f50;
}

.swiper-certify {
  height: 550px;
  width: 100%;
  min-width: 100px;
  margin: 0 auto;
}

.swiper-certify .centerPosition {
  position: absolute;
  top: 50%;
  left: 50%;
}

.swiper-certify .YcenterPosition {
  position: absolute;
  top: 50%;
}

.swiper-certify .XcenterPosition {
  position: absolute;
  left: 50%;
}

.swiper-certify ul.swiper-certif-list {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  position: relative;
}

.swiper-certify ul.swiper-certif-list li {
  width: 50%;
  position: absolute;
  transition: all 0.5s ease-out;
  border-radius: 5px;
  text-align: center;
  cursor: pointer;
}

.swiper-certify ul.swiper-certif-list li img {
  width: 900px;
  margin: 0 auto;
  box-shadow: 0 10px 20px -10px rgba(51, 51, 51, 0.32941);
  display: block;
}

.swiper-certify .line {
  text-align: center;
  margin-top: 48px;
}

.swiper-certify .line span {
  display: inline-block;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  margin-right: 24px;
  background: #ceddfa;
  cursor: pointer;
}

.swiper-certify .line span:last-child {
  margin-right: 0;
}

.swiper-certify .line span.active {
  background: #3a7df7;
}

.swiper-certify .p0,
.swiper-certify .p1 {
  opacity: 0;
  transform: translate3d(0, -50%, 0) scale(0.7);
  transform-origin: 50% 50%;
  z-index: 0;
}

.swiper-certify .p2 {
  opacity: 0.3;
  transform: translate3d(0, -50%, 0) scale(0.6);
  transform-origin: 50% 50%;
  z-index: 1;
}

.swiper-certify .p3 {
  transform: translate3d(15%, -50%, 0) scale(0.8);
  transform-origin: 80% 50%;
  opacity: 0.6;
  z-index: 2;
}

.swiper-certify .p4 {
  transform: translate3d(50%, -50%, 0) scale(1);
  transform-origin: 0 50%;
  z-index: 3;
  opacity: 1;
}

.swiper-certify .p5 {
  transform: translate3d(85%, -50%, 0) scale(0.8);
  transform-origin: 20% 50%;
  opacity: 0.7;
  z-index: 2;
}

.swiper-certify .p6 {
  opacity: 0.3;
  transform: translate3d(100%, -50%, 0) scale(0.6);
  transform-origin: 50% 50%;
  z-index: 1;
}

.swiper-certify .p7,
.swiper-certify .p8,
.swiper-certify .p9 {
  opacity: 0;
  transform: translate3d(100%, -50%, 0) scale(0.6);
  transform-origin: 50% 50%;
  z-index: 0;
}

@media screen and (max-width: 1683px) {
  .swiper-certify .p2 {
    transform: translate3d(-8%, -50%, 0) scale(0.6);
  }

  .swiper-certify .p3 {
    transform: translate3d(12%, -50%, 0) scale(0.8);
  }

  .swiper-certify .p4 {
    transform: translate3d(47%, -50%, 0) scale(1);
  }

  .swiper-certify .p5 {
    transform: translate3d(82%, -50%, 0) scale(0.8);
  }

  .swiper-certify .p6 {
    transform: translate3d(102%, -50%, 0) scale(0.6);
  }
}

@media screen and (max-width: 1583px) {
  .swiper-certify .p2 {
    transform: translate3d(-8%, -50%, 0) scale(0.6);
  }

  .swiper-certify .p3 {
    transform: translate3d(12%, -50%, 0) scale(0.8);
  }

  .swiper-certify .p4 {
    transform: translate3d(44%, -50%, 0) scale(1);
  }

  .swiper-certify .p5 {
    transform: translate3d(79%, -50%, 0) scale(0.8);
  }

  .swiper-certify .p6 {
    transform: translate3d(100%, -50%, 0) scale(0.6);
  }
}

@media screen and (max-width: 1483px) {
  .swiper-certify .p2 {
    transform: translate3d(-12%, -50%, 0) scale(0.6);
  }

  .swiper-certify .p3 {
    transform: translate3d(7%, -50%, 0) scale(0.8);
  }

  .swiper-certify .p4 {
    transform: translate3d(39%, -50%, 0) scale(1);
  }

  .swiper-certify .p5 {
    transform: translate3d(74%, -50%, 0) scale(0.8);
  }

  .swiper-certify .p6 {
    transform: translate3d(97%, -50%, 0) scale(0.6);
  }
}

@media screen and (max-width: 1383px) {
  .swiper-certify .p2 {
    transform: translate3d(-7%, -50%, 0) scale(0.6);
  }

  .swiper-certify .p3 {
    transform: translate3d(8%, -50%, 0) scale(0.8);
  }

  .swiper-certify .p4 {
    transform: translate3d(35%, -50%, 0) scale(1);
  }

  .swiper-certify .p5 {
    transform: translate3d(67%, -50%, 0) scale(0.8);
  }

  .swiper-certify .p6 {
    transform: translate3d(88%, -50%, 0) scale(0.6);
  }
}

@media screen and (max-width: 1283px) {
  .swiper-certify .p2 {
    transform: translate3d(-12%, -50%, 0) scale(0.6);
  }

  .swiper-certify .p3 {
    transform: translate3d(2%, -50%, 0) scale(0.8);
  }

  .swiper-certify .p4 {
    transform: translate3d(28%, -50%, 0) scale(1);
  }

  .swiper-certify .p5 {
    transform: translate3d(63%, -50%, 0) scale(0.8);
  }

  .swiper-certify .p6 {
    transform: translate3d(85%, -50%, 0) scale(0.6);
  }
}

.carousel {
  width: 100%;
  height: 480px;
}

.carousel .whole {
  width: 70%;
  height: 100%;
  margin: 0 auto;
}

.carousel .whole .roll-img {
  width: 100%;
  height: 100%;
  position: relative;
  transform-style: preserve-3d;
}

.carousel .whole .roll-img ul li {
  position: absolute;
  width: 900px;
  height: 100%;
  cursor: pointer;
}

.carousel .whole .roll-img ul li img {
  width: 100%;
}

.carousel .left {
  left: -400px;
  transform: scale(0.8);
  z-index: 4;
  background: #000;
  transition: all 0.5s ease;
}

.carousel .center {
  z-index: 6;
  left: 0;
  top: 0;
  bottom: 10%;
  transition: all 0.5s ease;
}

.carousel .right {
  left: 400px;
  transform: scale(0.8);
  z-index: 4;
  background: #000;
  transition: all 0.5s ease;
}

.carousel .left div,
.carousel .right div {
  z-index: 5;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  left: 0;
  top: 0;
  transition: all 0.3s ease;
}

.carousel .after1,
.carousel .after2,
.carousel .after3 {
  z-index: 3;
  left: 0;
  top: 0;
  visibility: hidden;
  transform: scale(0);
}

.carousel .last,
.carousel .next {
  position: absolute;
  z-index: 10;
  width: 50px;
  height: 50px;
  border: 5px solid hsla(0, 0%, 100%, 0.7);
  border-radius: 50px;
  font-size: 50px;
  font-weight: 700;
  text-align: center;
  line-height: 45px;
  cursor: pointer;
  top: 45%;
  color: hsla(0, 0%, 100%, 0.6);
}

.carousel .list {
  width: 30%;
  height: 5px;
  display: flex;
  margin: 20px auto 0;
}

.carousel .btn {
  transition: all 0.3s ease;
  flex: 1;
  background: #f4f4f4;
}

.carousel .btn:not(:first-child) {
  margin-left: 20px;
}

.carousel .last {
  left: -200px;
}

.carousel .next {
  right: -200px;
}

.carousel .btn.active {
  background: red;
}

.logbox {
  width: 840px;
  margin: 50px auto;
  position: relative;
}

.logbox .line {
  height: 100%;
  width: 1px;
  border-right: 1px solid #efefef;
}

.logbox .ico,
.logbox .line {
  position: absolute;
  left: 50%;
  top: 0;
}

.logbox .ico {
  background: url(/statics/dcbrowser/image/icon.png) no-repeat -45px -137px #fff;
  width: 40px;
  z-index: 1;
  margin-left: -20px;
  height: 45px;
}

.logbox .icofooter {
  background: #ccc;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  bottom: 0;
  margin-left: -6px;
}

.logbox .loglist {
  margin: 80px auto 68px;
  float: left;
  width: 100%;
}

.logbox .loglist li {
  float: right;
  width: 100%;
  margin: 20px auto;
}

.logbox .loglist li:nth-child(3) ~ li {
  display: none;
}

.log-wrap.open .logbox .loglist li:nth-child(3) ~ li {
  display: block;
}

.logbox .loglist div {
  border: 1px solid #efefef;
  border-radius: 5px;
  width: 300px;
  padding: 10px 30px;
  line-height: 30px;
  font-size: 16px;
  float: right;
  position: relative;
}

.logbox .loglist div i {
  position: absolute;
  top: 25px;
  left: -6px;
  width: 7px;
  height: 15px;
  background: url(/statics/dcbrowser/image/icon.png) no-repeat 0 -182px;
}

.logbox .loglist div span {
  border: 2px solid #3a7df7;
  height: 24px;
  width: 24px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  left: -72px;
  top: 18px;
}

.logbox .loglist div span em {
  background: #3a7df7;
  height: 8px;
  width: 8px;
  border-radius: 50%;
  display: block;
  margin: 8px auto;
}

.logbox .loglist div p {
  color: #3a7df7;
  position: absolute;
  width: 120px;
  left: -220px;
  top: 20px;
  text-align: center;
  line-height: 22px;
}

.logbox .loglist div p em {
  color: #888;
  font-size: 12px;
}

.logbox .loglist div.log {
  float: left;
}

.logbox .loglist div.log i {
  right: -6px;
  left: auto;
  background-position: -10px -182px;
}

.logbox .loglist div.log span {
  right: -74px;
  left: auto;
}

.logbox .loglist div.log p {
  left: auto;
  right: -230px;
}

.logbox .cl {
  clear: both;
}

.logbox pre {
  color: inherit;
  font-size: inherit;
  white-space: break-spaces;
  white-space: pre-wrap;
  margin: unset;
  font-family: inherit;
}

:root {
  --animate-duration: 1s;
  --animate-delay: 1s;
  --animate-repeat: 1;
}

.animate__animated {
  -webkit-animation-duration: 1s;
  -webkit-animation-duration: var(--animate-duration);
  animation-duration: 1s;
  animation-duration: var(--animate-duration);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.animate__fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes bounceIn {
  0%,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    transform: scaleX(1);
  }
}

@keyframes bounceIn {
  0%,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    transform: scaleX(1);
  }
}

.animate__bounceIn {
  -webkit-animation-duration: 0.75s;
  -webkit-animation-duration: calc(var(--animate-duration) * 0.75);
  animation-duration: 0.75s;
  animation-duration: calc(var(--animate-duration) * 0.75);
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes slideInDown {
  0% {
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    transform: translateZ(0);
  }
}

@keyframes slideInDown {
  0% {
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    transform: translateZ(0);
  }
}

.animate__slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  0% {
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    transform: translateZ(0);
  }
}

@keyframes slideInLeft {
  0% {
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    transform: translateZ(0);
  }
}

.animate__slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes pulse {
  0% {
    transform: scaleX(1);
  }

  50% {
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    transform: scaleX(1);
  }
}

@keyframes pulse {
  0% {
    transform: scaleX(1);
  }

  50% {
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    transform: scaleX(1);
  }
}

.animate__pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
}

.log-wrap {
  background: #f6f6f6;
  padding-bottom: 100px;
}

.log-wrap .title {
  padding: 1px;
  text-align: center;
  margin-bottom: 62px;
}

.log-wrap .title h2 {
  font-size: 50px;
  font-weight: 700;
  margin: 62px 0 0;
}

.log-wrap .log-main {
  width: 1200px;
  margin: 0 auto;
  background-color: #fff;
  padding: 20px 0;
}

.log-wrap .log-btn {
  display: block;
  width: 120px;
  height: 40px;
  line-height: 40px;
  background: #3a7df7;
  font-size: 16px;
  color: #fff;
  cursor: pointer;
  text-align: center;
  border-radius: 4px;
  margin: 40px auto 0;
}

.log-wrap .log-btn:hover {
  opacity: 0.9;
}

.log-wrap.open .log-btn.more,
.log-btn.stow {
  display: none;
}

.log-wrap.open .log-btn.stow {
  display: block;
}

.text_contions .wentips {
  padding-bottom: 24px;
  border-bottom: 1px dashed #999;
  display: flex;
}

.text_contions .wentips img {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  margin-right: 7px;
  display: inline-block;
  vertical-align: middle;
}

.text_contions .wentips span {
  flex: 1;
  font-size: 14px;
  display: inline-block;
  color: #ff8f21;
  line-height: 16px;
}

.text_contions .h2 {
  font-size: 16px;
  color: #333;
  font-weight: 700;
  margin: 36px 0 31px;
}

.text_contions .h2.h2mo {
  margin: 0 0 31px;
}

.text_contions .ptxt {
  font-size: 14px;
  color: #333;
  line-height: 25px;
}

.text_contions .ptxt_p {
  margin: 26px 0;
}

.text_contions .tip_imgs {
  width: 100%;
}

.text_contions .tip_imgs .win314 {
  max-width: 100%;
}

.text_contions .colors {
  color: #3a7df7;
  cursor: pointer;
}

.text_contions dd {
  float: left;
  width: 50%;
  padding: 10px 0;
}

.text_contions dd span {
  float: left;
  width: 160px;
  color: #686868;
}

input::-ms-clear {
  width: 0;
  height: 0;
}

.sys-mac,
.sys-xp,
.sys-win64,
[hidden] {
  display: none;
}
